<template>
  <div class="box">
        <div class="affirm">
            <img src="/static/imgs_s09/s09_yes.png" alt="">
            <span>您已确认了活动</span>
        </div>
        <div class="body">
            <span class="detail">活动详情:</span>
            <span class="content">都市焰火主题烤吧-价值116元的2斤烤羊腿免费抢</span>
            <span class="date">活动时间:</span>
            <span class="day">2019年12月15日 - 2020年1月1日</span>
            <span class="address">活动地址:</span>
            <span class="here">郑州市金水区中州大道农业路苏荷中心</span>
        </div>
        <div class="footer">
            <div class="ticket">查看券码</div>
            <div class="active">查看活动</div>
        </div>


    </div>
</template>

<script>

export default {
  data () {
    return {
      
      }
    },

  methods: {
   
  },

  created () {
    // let app = getApp()
  }
}
</script>

<style scoped>
        .box {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
        }

        .box .affirm img {
            height: 39px;
            width: 39px;
            margin-left: 101px;
            margin-right: 6px;
        }

        .box .affirm {
            display: flex;
            flex-direction: row;
            align-items: center;
            height: 90px;
            width: 375px;
            font-size: 18px;
            font-weight: bold;
            color: rgba(34, 34, 34, 1);
        }

        .box .body {
            height: 120px;
            width: 375px;
            position: absolute;
            top: 90px;
        }

        .body .detail {
            position: absolute;
            font-size: 13px;
            font-weight: 400;
            color: rgba(153, 153, 153, 1);
            left: 20px;
            top: 10px;
        }

        .body .content {
            position: absolute;
            width: 235px;
            height: 27px;
            font-size: 13px;
            font-weight: 400;
            color: rgba(85, 111, 181, 1);
            left: 90px;
            top: 10px;
        }

        .body .date {
            position: absolute;
            font-size: 13px;
            font-weight: 400;
            color: rgba(153, 153, 153, 1);
            left: 20px;
            top: 50px;
        }

        .body .day {
            position: relative;
            font-size: 13px;
            font-weight: 400;
            color: rgba(0, 0, 0, 1);
            left: 90px;
            top: 50px;
        }

        .body .address {
            position: absolute;
            font-size: 13px;
            font-weight: 400;
            color: rgba(153, 153, 153, 1);
            left: 20px;
            top: 70px;
        }

        .body .here {
            position: absolute;
            font-size: 13px;
            font-weight: 400;
            color: rgba(0, 0, 0, 1);
            left: 90px;
            top: 70px;
        }

        .box .footer {
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .footer .ticket {
            margin-top: 150px;
            width: 157px;
            height: 38px;
            border: 1px solid rgba(50, 177, 108, 1);
            border-radius: 19px;
            font-size: 15px;
            font-weight: 500;
            color: rgba(50, 177, 108, 1);
            line-height: 38px;
            text-align: center;
        }

        .footer .active {
            margin-top: 150px;
            width: 157px;
            height: 38px;
            border: 1px solid rgba(50, 177, 108, 1);
            border-radius: 19px;
            font-size: 15px;
            font-weight: 500;
            color:rgba(255,255,255,1);
            background:rgba(50,177,108,1);
            line-height: 38px;
            text-align: center;
            margin-left: 10px;
        }
    </style>
